<template>
    <div class="beijing">
    <div class="hezi1">
        <div class="touxiang">
            <img src="../assets/img/yanjing.jpg" alt="">
        </div>
        <el-form :model="tongbu" label-width="0px" class="biaodan">
            <el-form-item >
              <el-input v-model="tongbu.username"></el-input>
            </el-form-item>
            <el-form-item >
              <el-input v-model="tongbu.password"></el-input>
            </el-form-item>
            <div class="hezi2">
                <el-form-item >
        <el-button type="info" plain>登录</el-button>
                </el-form-item>
        <el-form-item >
        <el-button type="info" plain>注册</el-button>
        </el-form-item>
            </div>
        </el-form>
    </div>
    </div>
</template>
<script>
export default {
  data () {
    return {
      tongbu: {
        username: 'admin',
        password: '123456'
      }
    }
  },
  methods: {
  }
}
</script>
<style scoped>
.beijing{
    height: 100%;
    background-image: url('../assets/img/shejitu.jpg');
    background-size:100%;
}
.hezi1{
width: 135px;
height: 200px;
/* background-color: ivory; */
position: absolute;
left: 364px;
bottom: 71px;
}
.touxiang{
    position: absolute;
    width: 90px;
    height: 90px;
    background-color: lightcoral;
    border-radius: 50%;
    left: 50%;
    transform: translate(-50%);
    overflow: hidden;
}
.touxiang img{
    width: 150%;
    height: 100%;
    transform: translate(-18%);
}
.hezi2{
width: 150px;
height: 99px;
/* background-color: ivory; */
position: absolute;
left: 525px;
bottom: 21px;
}
.biaodan{
    position: absolute;
    bottom: -20px;
}
</style>
